<template>
    <!-- This is an example component -->
    <div class=" bg-gray-900">
        <div class="max-w-2xl mx-auto text-white py-10">
            <div class="text-center">
                <h3 class="text-3xl mb-3"> Open source trial </h3>
                <p> Stay fit. All day, every day. </p>
                <div class="flex justify-center my-10">
                    <!-- github -->
                    <div class="flex items-center border w-auto rounded-lg px-4 py-2 w-52 mx-2">
                        <img src="https://avatars.githubusercontent.com/u/9919?s=200&v=4" class="w-7 md:w-8">
                        <div class="text-left ml-3">
                            <a href="https://github.com/ckw0812/Springboot_OnlineJudge_Systeam.git"
                                data-placement="top" title="Github" target="_blank">
                                <p class='text-xs text-gray-200'>Download on </p>
                                <p class="text-sm md:text-base"> Github </p>
                            </a>
                        </div>
                    </div>
                    <!-- gitee -->
                    <div class="flex items-center border w-auto rounded-lg px-4 py-2 w-52 mx-2">
                        <img src="https://tse4-mm.cn.bing.net/th/id/OIP-C.50sXWHwozA-mm2VeLG8UhgAAAA?w=165&h=175&c=7&r=0&o=5&pid=1.7" class="w-7 md:w-8">
                        <div class="text-left ml-3">
                            <a href="https://gitee.com/aa760303601_AA/SpringBoot_OnlineJudge_Systeam.git"
                                data-placement="top" title="Gitee" target="_blank">
                                <p class='text-xs text-gray-200'>Download on </p>
                                <p class="text-sm md:text-base"> Gitee </p>
                            </a>
                        </div>
                    </div>
                    <!-- csdn -->
                    <div class="flex items-center border w-auto rounded-lg px-4 py-2 w-44 mx-2">
                        <img src="https://tse3-mm.cn.bing.net/th/id/OIP-C.YihwlKpWt9K5GyRQ2lCrcQAAAA?w=134&h=150&c=7&r=0&o=5&pid=1.7"
                            class="w-7 md:w-8">
                        <div class="text-left ml-3">
                            <a href="http://t.csdn.cn/XnBKi" data-placement="top" title="CSDN" target="_blank">
                                <p class='text-xs text-gray-200'>Contact Blog </p>
                                <p class="text-sm md:text-base"> CSDN </p>
                            </a>

                        </div>
                    </div>
                </div>
            </div>
            <div class="mt-28 flex flex-col md:flex-row md:justify-between items-center text-sm text-gray-400">
                <p class="order-2 md:order-1 mt-8 md:mt-0"> 桂ICP备 2023003399号-1 </p>
                <p class="order-2 md:order-1 mt-8 md:mt-0"> &copy; 2023 All right reserved </p>
                <div class="order-1 md:order-2">
                    <span class="px-2"><a href='tencent://message/?uin=760303601'>联系我们</a></span>
                    <span class="px-2 border-l"><a href="/privacy">隐私策略</a></span>
                    <span class="px-2 border-l"><a href="/donation">喝杯咖啡</a></span>
                </div>
            </div>
        </div>
    </div>
</template>

<!-- 舊版本 -->
<!-- <div id="sub-footer">
    <div>
      <el-row>
        <el-col :span="12">
          <div class="copyright" style="margin-left: 20%;">

            <p>&copy; CodeSky 2023 All right reserved.
            </p>
            <p>
              
            </p>
          </div>
        </el-col>
        <el-col :span="12">
          <ul class="social-network" style="margin-right: 20%;">
            <li><a href="https://gitee.com/aa760303601_AA/SpringBoot_OnlineJudge_Systeam.git" data-placement="top"
                target="_blank" title="github"><icon-github theme="outline" size="24"
                  fill="#f8f8f8"></icon-github></a></li>
            <li><a href="http://t.csdn.cn/i7dyC" data-placement="top" title="CSDN"
                target="_blank"><icon-topic-discussion theme="outline" size="24"
                  fill="#f8f8f8"></icon-topic-discussion></a></li>

          </ul>
        </el-col>
      </el-row>
    </div>
  </div> -->